import React from 'react';
import ReactBootstrap4,{
    Container,
    Input,
    Button,
    CCheckbox,
    Table,
    Pagination,
    Dropdown,
    Select,
    Calendar,
    TextArea,
    Switch,
    Label,
    TabsContent,
    Tabs,
    Box,
	Radio,
	RadioGroup,
	Common,
} from '@clake/react-bootstrap4';
import {
    CTable,
	Window,
	WModal
} from '@clake/react-bootstrap4-window';
import Form from '../../common/Form';
import {GetData, ComboSearch, ProcessData} from '../../common/DataService';
class FUrsLog extends React.Component {
    constructor(props) {
        super(props);
        this.id = 'f_urs_log';
		this.title = 'Enter URS';
        if (!this.props.width) {
            this.width = '636px';
        }
        if (!this.props.height) {
            this.height = '504px';
        }
		this.source = 's_urs';
        this.process = 't_urs';
		if (this.props.parent instanceof Window) {
            //window 窗体对像
            this.window = this.props.parent;
            //window 管理对像
            this.manage = this.window.parent;
            //传送的窗体参数
            this.params = this.window.params;
        }

		this.state = {
			data:{},
            isEdit:!!this.window?.params?.id
		};
    }

    componentDidMount() {
        console.log(this.window.params);
		this.window.on(Window.EVT_SHOW,this.showHandler);
        this.window.on(Window.EVT_CLOSE,this.closeHandler);
		this.getData(this.window?.params?.id)
    }

    showHandler = ()=>{
        this.getData(this.window?.params?.id)
    };

    closeHandler = ()=>{
        
    };


	getData = (id) => {
		if (!id) {
			return;
		}
        let condition = {
            field:'urs_id',
            value: id + '',
            flag:  'eq'
        };
        this.modal.loading('Loading...');
        GetData('s_urs',1,1, [condition],null,(res)=>{
            this.modal.close();
            if (res.status) {
                if (res.data.list && res.data.list[0]) {
                    this.setState({
                        data:res.data.list[0],
                        isEdit:true,
                    });
                } else {
                    this.modal.alert('not found data');
                }
            } else {
                this.setState({
                    data:{}
                });
            }
        });
    };

    newData = () => {
        this.window.params = {};
        this.setState({
            data:this.form.getNew(),
            isEdit:false,
        })
    };

    saveData = () => {
        ProcessData(this.process,this.state.isEdit?'edit':'new',this.state.data,(res)=>{
            if (res.status) {
                if (!this.state.isEdit) {
                    this.window.params.id = res.data.new_id;
                }
                this.setState({
                    isEdit:true,
                },()=>{
                    this.modal.alert('save success');
                });
            } else {
                this.modal.alert('save data error:'+res.msg);
            }
        })
    };

    deleteData = ()=>{
        ProcessData(this.process,'delete',{'urs_id':this.window.params.id},(res)=>{
            if (res.status) {
                this.modal.alert({
                    content: 'delete success',
                    callback: ()=>{
                        this.window.close();
                    }
                });
            } else {
                this.modal.alert('save data error:'+res.msg);
            }
        })
    };


    fieldChangeHandler = (field,val,row,type,textField)=>{
        let data = this.state.data;
        if (type==='combo') {
            data[field] = row?row[field]??row[textField]:'';
			data[textField] = val;
        } else {
            data[field] = val;
        }
        this.setState({data:data});
    };
	
	sortHandler() {}

	filterHandler() {}

	open() {}

    render() {
        return (
            <Form ref={c=>this.form=c} onChange={this.fieldChangeHandler}>
                <Input jsxId={'urs_log_no'} field={'urs_no'} absolute={true} size={'xs'} x={'88px'} y={'36px'} width={'108px'} tabIndex={'0'} align={'left'} disabled={true} data={this.state.data?.urs_no}/>
                <Label jsxId={'Label719'} sm={true} absolute={true} x={'20px'} y={'36px'} width={'60px'} height={'20px'} align={'left'} color={'rgb(0,0,0)'} text={'URS No.'}/>
                <Input jsxId={'urs_date'} field={'urs_date'} absolute={true} size={'xs'} x={'276px'} y={'120px'} width={'100px'} tabIndex={'1'} align={'left'} calendar={{format:'YYYY-MM-DD'}} data={this.state.data?.urs_date?moment(this.state.data?.urs_date).format('YYYY-MM-DD'):''}/>
                <Box jsxId={'box_00_11'} absolute={true} x={'392px'} y={'104px'} width={'224px'} height={'152px'} borderColor={'rgb(128,128,128)'} borderWidth={'1px'}/>
                <TextArea jsxId={'urs_attachment'} field={'urs_attachment'} absolute={true} size={'xs'} x={'20px'} y={'284px'} width={'596px'} tabIndex={'2'} height={'200px'} data={this.state.data?.urs_attachment}/>
                <Label jsxId={'Label774'} sm={true} absolute={true} x={'20px'} y={'264px'} width={'540px'} height={'20px'} align={'center'} color={'rgb(255,255,255)'} backColor={'rgb(128,128,128)'} text={'Attachment'}/>
                <Box jsxId={'Box732'} absolute={true} x={'20px'} y={'104px'} width={'372px'} height={'152px'} borderColor={'rgb(128,128,128)'} borderWidth={'1px'}/>
                <Input jsxId={'urs_subject'} field={'urs_subject'} absolute={true} size={'xs'} x={'88px'} y={'68px'} width={'296px'} tabIndex={'3'} align={'left'} data={this.state.data?.urs_subject}/>
                <Label jsxId={'Label741'} sm={true} absolute={true} x={'20px'} y={'68px'} width={'60px'} height={'20px'} align={'left'} color={'rgb(0,0,0)'} text={'Subject'}/>
                <TextArea jsxId={'close_note'} field={'close_note'} absolute={true} size={'xs'} x={'408px'} y={'140px'} width={'192px'} tabIndex={'4'} height={'96px'} disabled={true} data={this.state.data?.close_note}/>
                <Label jsxId={'Label786'} sm={true} absolute={true} x={'408px'} y={'120px'} width={'192px'} height={'20px'} align={'center'} color={'rgb(255,255,255)'} backColor={'rgb(128,128,128)'} text={'Close Note'}/>
                <Input jsxId={'close_by_code'} field={'close_by_code'} absolute={true} size={'xs'} x={'168px'} y={'216px'} width={'100px'} tabIndex={'5'} align={'left'} disabled={true} data={this.state.data?.close_by_code}/>
                <Label jsxId={'Label790'} sm={true} absolute={true} x={'36px'} y={'216px'} width={'124px'} height={'20px'} align={'left'} color={'rgb(0,0,0)'} text={'Close By - Priority'}/>
                <Input jsxId={'close_date'} field={'close_date'} absolute={true} size={'xs'} x={'168px'} y={'184px'} width={'100px'} tabIndex={'6'} align={'left'} disabled={true} calendar={{format:'YYYY-MM-DD'}} data={this.state.data?.close_date?moment(this.state.data?.close_date).format('YYYY-MM-DD'):''}/>
                <Label jsxId={'Label752'} sm={true} absolute={true} x={'36px'} y={'184px'} width={'124px'} height={'20px'} align={'left'} color={'rgb(0,0,0)'} text={'Close - Released'}/>
                <Input jsxId={'release_date'} field={'release_date'} absolute={true} size={'xs'} x={'276px'} y={'184px'} width={'100px'} tabIndex={'7'} align={'left'} disabled={true} calendar={{format:'YYYY-MM-DD'}} data={this.state.data?.release_date?moment(this.state.data?.release_date).format('YYYY-MM-DD'):''}/>
                <Button jsxId={'btn1PostLog'} absolute={true} size={'xs'} x={'556px'} y={'40px'} width={'60px'} height={'40px'} outline={true} theme={'danger'}>
                    Post URS
                </Button>
                <Button jsxId={'btn1UndoPost'} absolute={true} size={'xs'} x={'496px'} y={'40px'} width={'60px'} height={'40px'} outline={true} theme={'info'}>
                    Undo <br/>Post
                </Button>
                <Input jsxId={'GroupBr'} field={'GroupBr'} absolute={true} size={'xs'} x={'276px'} y={'152px'} width={'100px'} tabIndex={'10'} align={'left'} disabled={true} data={this.state.data?.GroupBr}/>
                <Box jsxId={'Boxheadline'} absolute={true} x={'0px'} y={'0px'} width={'492px'} height={'24px'} backColor={'rgb(53,88,117)'} borderColor={'rgb(0,0,0)'} borderWidth={'1px'}/>
                <Label jsxId={'urs_id'} sm={true} absolute={true} x={'80px'} y={'4px'} width={'52px'} height={'20px'} align={'left'} color={'rgb(255,255,255)'} field={'urs_id'} text={this.state.data?.urs_id}/>
                <Label jsxId={'lbl_efc_branch_id'} sm={true} absolute={true} x={'16px'} y={'4px'} width={'60px'} height={'20px'} align={'left'} color={'rgb(255,255,255)'} text={'Seq No.'}/>
                <Button jsxId={'btn0Add'} onClick={this.newData} absolute={true} size={'xs'} x={'576px'} y={'0px'} width={'28px'} height={'24px'} outline={true} icon={'folder-plus'} theme={'dark'}>
                    
                </Button>
                <Button jsxId={'btn0Delete'} onClick={this.deleteData} absolute={true} size={'xs'} x={'548px'} y={'0px'} width={'28px'} height={'24px'} outline={true} icon={'times-circle'} theme={'danger'}>
                    
                </Button>
                <Button jsxId={'btn0Clone'} absolute={true} size={'xs'} x={'520px'} y={'0px'} width={'28px'} height={'24px'} outline={true} icon={'clone'} theme={'dark'}>
                    
                </Button>
                <Button jsxId={'btn0Reload'} onClick={this.showHandler} absolute={true} size={'xs'} x={'492px'} y={'0px'} width={'28px'} height={'24px'} outline={true} icon={'sync-alt'} theme={'success'}>
                    
                </Button>
                {this.state.isEdit?<Button onClick={this.saveData} jsxId={'btn0Edit'} absolute={true} size={'xs'} x={'604px'} y={'0px'} width={'28px'} height={'24px'} outline={true} icon={'edit'} theme={'success'}>
                </Button>:
                <Button jsxId={'btn0Save'} onClick={this.saveData} absolute={true} size={'xs'} x={'604px'} y={'0px'} width={'28px'} height={'24px'} outline={true} icon={'save'} theme={'success'}>
                </Button>}
                <Box jsxId={'BoxhearlineButton'} absolute={true} x={'492px'} y={'0px'} width={'140px'} height={'24px'} borderColor={'rgb(128,128,128)'} borderWidth={'1px'}/>
                <Label jsxId={'status_desc'} sm={true} absolute={true} x={'220px'} y={'4px'} width={'96px'} height={'20px'} align={'left'} color={'rgb(255,255,255)'} field={'status_desc'} text={this.state.data?.status_desc}/>
                <Label jsxId={'Label789'} sm={true} absolute={true} x={'164px'} y={'4px'} width={'52px'} height={'20px'} align={'left'} color={'rgb(255,255,255)'} text={'Status'}/>
                <Button jsxId={'btn1Upload'} absolute={true} size={'xs'} x={'560px'} y={'264px'} width={'28px'} height={'20px'} outline={true} icon={'upload'} theme={'success'}>
                    
                </Button>
                <Button jsxId={'btn0Expand'} absolute={true} size={'xs'} x={'588px'} y={'264px'} width={'28px'} height={'20px'} outline={true} icon={'expand-arrows-alt'} theme={'dark'}>
                    
                </Button>
                <Input jsxId={'urs_by_code'} field={'urs_by_code'} absolute={true} size={'xs'} x={'168px'} y={'120px'} width={'100px'} tabIndex={'21'} align={'left'} data={this.state.data?.urs_by_code}/>
                <Label jsxId={'Label778'} sm={true} absolute={true} x={'36px'} y={'120px'} width={'124px'} height={'20px'} align={'left'} color={'rgb(0,0,0)'} text={'Report By - Date'}/>
                <Input jsxId={'work_id'} field={'work_id'} absolute={true} size={'xs'} x={'168px'} y={'152px'} width={'100px'} tabIndex={'22'} align={'left'} disabled={true} data={this.state.data?.work_id}/>
                <Label jsxId={'Label788'} sm={true} absolute={true} x={'36px'} y={'152px'} width={'124px'} height={'20px'} align={'left'} color={'rgb(0,0,0)'} text={'Work ID - Group'}/>
                <Input jsxId={'priority_id'} field={{key:'priority_id',text_key:'priority_desc'}} size={'xs'} absolute={true} x={'276px'} y={'216px'} width={'100px'} align={'left'} combo={{
                    onSearch:ComboSearch('priority_desc','q_urs_tb_priority'),
                    searchColumn:'priority_desc',
                    width:'100px',
                    header:false,
                    filterColumns:[
                        {field:'priority_desc',width:'96px'}
                    ]
                }} data={this.state.data?.priority_desc}/>
				<WModal ref={c=>this.modal=c}/>
            </Form>
        );
    }
}

export default FUrsLog;
